<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../../vue.js"></script>
    <script>
        window.onload=function () {
            var vm = new Vue({//不使用对象的时候直接new： new Vue({
                el:'#box',//数据需要释放哪里——选择器
                data:{
                    arr:['apple','pear','orange','banana'],
                    json:{a:'apple',b:'pear',c:'orange',d:'banana'}
                }//传入的数据
            });//得到对象C

        };
    </script>
</head>
<body>
<div id="box">
    <!--实现循环-->
    <ul>
        <li v-for="value in arr">
            <!--$index是索引号0123-->
            {{value}} {{$index}}
        </li>
    </ul>
    <hr>
    <!--value和item这个就是个参数，不是什么时候都要一样所以可以换-->
    <!--数组和json都有index-->
    <!--$key是键$index是值-->
    <ul>
        <li v-for="item in json">
            {{item}}  {{$index}} {{$key}}
        </li>
    </ul>
    <hr>
    <!--json的另一种写法键值对-->
    <ul>
        <li v-for="(k,v) in json">
            {{k}}  {{v}}  {{$index}}
        </li>
    </ul>
</div>
</body>
</html>